import { createStore } from "vuex";

/* 本来是要封装的但是 这是这个版本不会用，将就一下把 */
/* import mutation from './mutation' */

export default createStore({
  state: {
    ImageLoadNum:0,  /* 没啥用 ， 记录一下有多少图片 ， 那边用的定时器 */

    cartShopping:[], /* 添加到购物车,运用Vuex */
  },
  mutations: {
    itemImageLoad(state){
      /* console.log("GoodsListitem提交调用了几次") */
      state.ImageLoadNum++
    },
    
    /* 这样写是可以跟踪的 ， 直接写再里面是不好调用的  虽然写的很难受*/
    /* 这个addCounter 也可以抽成常量 */
    addCounter(state,product){
      product.count++
    },
    
    addToCart(state,product){
      /* 这里是判断图标的属性 */
      state.cartShopping.change = true

      state.cartShopping.push(product)
    }
  },
  actions: {
    /* 新添加的商品 */
    addCartShopping(context,product){
      /* mutation 唯一的目的就是修改state中的状态 
         mutation 中的每个方法尽可能完成的事件比较简单一 一点    应该放入action
      */
      /* P-212 以后有时间细看一下 */
      let oldProduct = null;
      for(let item of context.state.cartShopping){
        if(item.id === product.id){
          oldProduct = item;
        }
      }

      //2.判断是否有新商品
      if(oldProduct){
        /* oldProduct.count +=1 */
        context.commit('addCounter',oldProduct)
      }else{
        product.count = 1  /* 计算有多少商品 */
        /* context.state.cartShopping.push(product) */
        context.commit('addToCart',product)
      }
     
      console.log(product) 
    }

  },
  modules: {},
 
});
